<!doctype html>
<html lang="en">
        <head>
                <meta charset="utf-8"/>
                <title>London, United Kingdom</title>
                <link href="styles/styles.css" rel="stylesheet" type="text/css"/>
        </head> 
        <body onLoad="parent.loadPage( 'London, United Kingdom' );javascript:parent.subtractTravel()">
 
  <section>
                        <header>
                                <h1> London, United Kingdom</h1>
                        </header>
                                
                        <div id="main-content">
                                <div class="column">
                                        <article>
                      <header>
          <h2>Flag of United Kingdom</h2>
          </header>
  <img src="images/britishflag.jpg" alt="Flag" title="Flag" height="130" width="190"/>
  </article>
      </div>
  <div class="column">
  <article>
           <header>
  <h2>London (Big ben)</h2>
  <img src="images/bigben.jpg" alt="Big ben" title="Big Ben" height="130" width="190"/>
   </header>
                                                
 </article>
   </div>
   
     <h2>
    Fact about London:
    </h2>
    
    <span id="bankroll" ></span>
    
    

  <p>
  London was the first city in the world to have an underground railway.
                                               
    </p>
                        <aside id="travel">
                                <h2 class="header-button" onClick="javascript:parent.showDestinations()">Travel</h2>
                                <div id="destinations">
                                </div>
                        </aside>
                        <aside id="investigate">
                                <h2 class="header-button" onClick="javascript:parent.showClue()">Investigate</h2>
                                <div id="clue">
                                </div>
                        </aside>
               
        </body>
</html>